<div class="modal-header bg-primary">
    <h3 class="modal-title">Run responders</h3>
</div>
<div class="modal-body">
    <p class="mb-xxs">
        Please select the responder you want to run
    </p>

    <div class="row mb-xxs">
        <div class="col-sm-12">
            <div class="has-feedback">
                <input type="text" ng-model="$dialog.state.filter" class="form-control" placeholder="Filter responders" autofocus>
                <span class="glyphicon glyphicon-search form-control-feedback"></span>
            </div>
        </div>
    </div>

    <div class="template-selector">
        <table class="table table-hover table-striped">
            <tbody>
                <tr ng-repeat="responder in $dialog.filteredResponders = ($dialog.responders | filter:$dialog.state.filter)"
                class="clickable"
                ng-class="{'active': $dialog.state.selected === responder.id}"
                ng-click="$dialog.next(responder)">
                    <td>
                        <strong>{{responder.name}}</strong><br>
                        <p class="list-group-item-text text-muted">{{responder.description}}</p>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

</div>
<div class="modal-footer text-left">
    <button class="btn btn-default" ng-click="$dialog.cancel()" type="button">Cancel</button>
</div>
